<template>
	<view>
		
		<view v-if="applyList && applyList.length>0">
			<uni-card v-for="(item,index) in applyList" :key="item.id" :title="item.nickName" @click="toAdd(item.id)">
		
				<template v-slot:extra>
					<view :class="['extra','extra'+item.applyStatus] " v-if="showStatus">
						<DictTag option="apply_status" :value="item.applyStatus"/>
					</view>
				</template>
		
				<view class="card-content">
					<view class="card-item">
						<view>申请积分：</view>
						<view>{{item.score}}</view>
					</view>
					<view class="card-item">
						<view>申请项目数：</view>
						<view>{{item.numItem}}</view>
					</view>
					<view class="card-item">
						<view>申请时间：</view>
						<view>{{parseTime(item.timeStart, '{y}-{m}-{d} {h}:{i}:{s}')}}</view>
					</view>
					
				</view>
		
			</uni-card>
		</view>
		<view v-else>
			<image style="width: 100%;" mode="aspectFit" src="/static/empty.png"></image>
		</view>
		
		<view style="height: 200rpx;"></view>
		
		<div class="fixed-button" @click="toAdd(0)">
			<uni-button>申 请</uni-button>
		</div>
	</view>
</template>

<script>
	import { getDicts } from '@/components/DictTag/DictTag.js'
	export default {
		
		data() {
			return {
				dictTypes:[
					'apply_status'
				],
				dicts:{
					apply_status:[],
				},
				applyList:[],
				showStatus:true,
				queryParams: {
					qUserId : undefined,
					daterange : undefined,
					qTimeStart : undefined,
					qTimeEnd : undefined,
					qStatus : 100,
					pageNum: 1,
					pageSize: 6,
				},
				total :0,
			}
		},
		onLoad(){
			this.getFormatDicts()
			this.getApplyList()
		},
		onReachBottom() {
			console.log(this.queryParams.pageNum)
			if (this.moreStatus == 'more') {
		      this.queryParams.pageNum++
		      this.getApplyList()
		    }
		},
		methods: {
			getFormatDicts(){
				this.dictTypes.forEach(dictType =>{
					getDicts(dictType).then(res =>{
						this.dicts[dictType] = res
					})
				})
			},
			getApplyList() {
				let userId = this.$store.state.user.userInfo.userId
				this.queryParams.qUserId = userId
				
				this.moreStatus = 'loading'
				this.$http({
					url: '/wx/wxPoiApply/getApplyListByUser',
					method: 'post',
					data: this.queryParams
				}).then(res => {
					
					this.showStatus = false
					// this.applyList = res.rows
					this.applyList = [...this.applyList, ...res.rows]
					
					this.$nextTick(() => {
						this.showStatus = true;
					})
				})
			},
			toAdd(id){
				uni.navigateTo({
					url:'/pages/apply/apply/apply?id='+encodeURIComponent(id)
				})
			}
		}
	}
</script>

<style lang="scss">
.extra {
	display: flex;
	justify-content: center;
	align-items: center;
	//border: solid 1rpx black;
	height: 40rpx;
	width: 200rpx;
	font-size: 25rpx;
	border-radius: 10rpx;
}

.extra100,.extra105 {
	color: #e43d33;
	//border: solid 1rpx #e43d33;
}

.extra200,.extra205 {
	color: #f3a73f;
	//border: solid 1rpx #f3a73f;
}

.extra300,.extra305 {
	color: #238ebc;
	//border: solid 1rpx #238ebc;
}
.extra10000 {
	color: #18bc37;
	//border: solid 1rpx #18bc37;
}
.card-content {
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
	width: 100%;

	.card-item {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.card-item:nth-child(1) {
		width: 50%;
	}

	.card-item:nth-child(2) {
		width: 50%;
	}

	.card-item:nth-child(3) {
		width: 100%;
	}
}
.fixed-button{
  position: fixed;
  bottom: 100rpx;
  right: 0rpx;
  background-color: #1890ff;
  color: #e8f4ff;
  height: 70rpx;
  width: 150rpx;
  line-height: 70rpx;
  text-align: center;
  border-radius: 50rpx 0 0 50rpx;
}
</style>
